<template>
	<el-dialog width="600px" :visible.sync="isShow">
		<template #title>
			<div class="dialog-title">提交提示</div>
		</template>
		<div class="tip">
			<p>
				成功识别
				<span class="success">{{ rightNum }}</span>道试题，
				<span class="error">{{ recognizeNumber.errorNum }}</span>道试题格式有误，您可以选择提交试题，
			</p>
			<p>也可以选择提交后补充试题的章节或标签信息。</p>
		</div>
		<div class="submit-btns">
			<el-button @click="isShow=false" :disabled="isLoading||isLoadingEdit">取消</el-button>
			<el-button
				type="primary"
				@click="onSubmit"
				:disabled="isLoadingEdit"
				:loading="isLoading"
			>
				提交
			</el-button>
			<el-button
				:class="[{'theme_font_color theme-border-color': !isLoading}]"
				:disabled="isLoading"
				@click="onSubmitEdit"
				:loading="isLoadingEdit"
			>
				提交并补充信息
			</el-button>
		</div>
	</el-dialog>
</template>
<script>
	export default {
		name: "test-specification",
		props: {
			// 弹窗显示
			show: {
				type: Boolean,
				default: false
			},
			recognizeNumber: {
				type: Object,
				default: () => {}
			},
			rightNum: {//识别成功题的数量
				type: Number,
				default: 0
			},
            isLoading:{//控制提交loading
                type: Boolean,
				default: false
            },
            isLoadingEdit:{//控制提交并补充loading
               type: Boolean,
				default: false
            }
		},
		data() {
			return {
				isShow: false
			};
		},
		watch: {
			show(val) {
				this.isShow = val;
			},
			isShow(val) {
				this.$emit("update:show", val);
			}
		},
        methods:{
             onSubmit(){
               this.$emit("submit");
            },
            onSubmitEdit(){
               this.$emit("submit-edit");
            }
        }
	};
</script>
<style scoped lang="less">
	.dialog-title {
		text-align: center;
		font-size: 16px;
		color: #333;
	}
	.tip {
		text-align: center;
		margin-bottom: 20px;
	}
	.success {
		color: #1890ff;
	}
	.error {
		color: #ff4436;
	}
	.submit-btns {
		display: flex;
		justify-content:center;
	}
</style>
